<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Fullscreen Anything Options</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">
</head>

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-2"></div>
            <div class="col-md-8">
                <div>
                    <h2><img src="img/icon48.png"> Fullscreen Anything Options</h2>
                    This extension will scan elements in document with priority below:
                    <li>video</li>
                    <li>canvas</li>
                    <li>embed</li>
                    <li>object</li>
                    <li>img</li>
                    And you can custom your own priority in options!
                    <hr>
                    <div class="form-group">
                        <label for="scanning_tags">Scanning Tags</label>
                        <input type="text" class="form-control" id="scanning_tags">
                        <span class="help-block">Custom your scanning tags. Join these tags with separator ","</span>
                    </div>
                    <div class="form-group">
                        <input class="form-check-input" type="checkbox" value="" id="enable_priority">
                        <label class="form-check-label" for="enable_priority">
                            Stop scanning once any elements were found
                        </label>
                        <span class="help-block">This extension will scan all available elements in document if
                            not checked.Otherwise it will stop scanning once any available elements were
                            found.</span>
                    </div>
                    <div class="form-group">
                        <input class="form-check-input" type="checkbox" value="" id="move_video_to_body">
                        <label class="form-check-label" for="move_video_to_body">
                            Whether move video to root node
                        </label>
                        <span class="help-block">You can try checking this option if video are not displayed in fullscreen sometimes.</span>
                    </div>
                    <div class="has-success">
                        <button type="button" class="btn btn-primary" id="save">Save</button>
                        <span id="save_success" class="help-block">Save successfully!</span>
                    </div>
                </div>
            </div>
            <div class="col-md-2"></div>
        </div>

    </div>
    <script src="js/common.js"></script>
    <script src="js/options.js"></script>
</body>

</html>